<!-- 收款 -->
<template>
	<view class="collectMoney">
		<template v-show="!boxHide">
			<view class="add_item">
				<view>直接收款金额(元)</view>
				<input type="text" v-model="upJson.price" @blur="createPayQRcode();checkPrice()" placeholder="请输入收款金额" />
			</view>
			<view class="add_item">
				<view>收支产生日期</view>
				<TimeSelect :defaultValue="utils.formatDate(new Date()).f3" @change="(date)=>{upJson.time=date.f3}"></TimeSelect>
			</view>
			<!-- <view class="add_item">
				<view>发票编号</view>
				<input type="text" v-model="upJson.invoiceNo" placeholder="请输入发票编号" />
			</view> -->
			<view class="add_item">
				<view>存入账户</view>
				<picker mode="selector" :range="intoTypes" @change="getIntoValue" :value='intoTypesIndex' :range-key="'title'"
				 class="add_picker">
					<text>{{intoTypes[intoTypesIndex].title}}</text>
					<image src="/static/images/right.png" class="right"></image>
				</picker>
			</view>
			<view class="add_item">
				<view>业务员</view>
				<input type="text" v-model="salesman.name" placeholder="选择业务员" @click.stop="openSearch('all_user')" disabled />
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_item">
				<view>收款方式</view>
				<picker mode="selector" :range="getMoneyTypes" @change="getMoneyIndexValue" :value='getMoneyTypesIndex' :range-key="'title'"
				 class="add_picker">
					<text>{{getMoneyTypes[getMoneyTypesIndex].title}}</text>
					<image src="/static/images/right.png" class="right"></image>
				</picker>
			</view>
			<view class="textArea_item" style="display:block">
				<view>说明</view>
				<view class="">
					<textarea v-model="upJson.explain" placeholder="输入说明" auto-height />
					</view>
			</view>
			<view class="payCodeView" v-if="getMoneyTypesIndex==0">
				<!-- <view class="payCode_handle">
					11
				</view> -->
				<view class="payCode_QRCode">
					<image :src="QRCodeUrl"></image>
				</view>
			</view>
			<view class="save" @click.stop="getMoney" v-if="getMoneyTypesIndex==1">确认收款</view>
		</template>
		<Loading ref="load"></Loading>
	</view>
</template>

<script>
	import {
		deepClone
	} from '@/static/js/index.js'
	export default {
		data() {
			return {
				boxHide:true,
				upJson: {
					price: '',
					time: "",
					invoiceNo: "",
					intoType: "",
					getMoneyType:"",
					explain:""
				},
				salesman:{
					id:"",
					name:""
				},
				intoTypes: [],
				intoTypesIndex: 0,
				getMoneyTypes: [{
						title: '线上',
						id: 0
					},
					{
						title: '线下',
						id: 1
					},
				],
				getMoneyTypesIndex: 1,
				orderId:"",
				QRCodeUrl:"",//收款二维码
				total_price:""
			}
		},
		onLoad(options) {
			this.orderId=options.id;
			this.getData();
			this.getIntoTypes();
		},
		onShow() {
			this.setBaseNews();
		},
		methods: {
			//设置基础信息
			setBaseNews(){
				let obj=deepClone(this.$store.getters['parameters/searchObj']);
				console.log('obj====',obj)	
				if(obj.key=="all_user"){
					this.setSalesmanVal(obj.data.id,obj.data.username);
				}
				this.$store.dispatch('parameters/deleteObj');
			},
			//设置业务员信息
			setSalesmanVal(id,name){
				this.salesman.id=id;
				this.salesman.name=name;
			},
			//获取页面数据
			getData(){
				this.$refs.load.initLoading({loadType:1,loadPrompt:false}).then(res =>{
					this.$api.getOrderDetail({id:this.orderId}).then(res => {
						this.boxHide=true;
						this.setSalesmanVal(res.user_id,res.user_name);
						this.upJson.price=res.total_price;
						this.total_price=res.total_price;
						this.createPayQRcode();
						this.upJson.explain='订单收款：客户('+res.customer_name+','+res.customer_title+' 业务员：'+this.salesman.name+') 订单编号为:'+res.order_no
						this.$refs.load.getLoadingData({})
					})
				})
			},
			//获取存款方式
			getIntoTypes(){
				this.$api.getOrderPayMethods().then(res => {
					this.intoTypes=res.map((item,index)=>{
						return {
							title:item,
							id:index
						}
					});
				})
			},
			//生成付款二维码
			createPayQRcode(){
				if(this.getMoneyTypesIndex==0)
					this.$refs.load.initLoading({loadType:-1}).then(res =>{
						// uni.showToast({
						// 	title: '线上支付暂时无法使用，请使用线下方式支付',
						// 	icon: "none",
						// })
						this.$api.getPayQRCode({order_id:this.orderId,price:this.upJson.price}).then(res=>{
							this.QRCodeUrl=res.code_url.indexOf('data:image/png;base64,')!=-1?res.code_url:'data:image/png;base64,'+res.code_url;
							this.$refs.load.getLoadingData({})
							this.isPay()
						})
					})
			},
			// 支付回调
			isPay(){

				this.$api.getOrderDetail({id:this.orderId}).then(res => {
						
						if(res.is_pay==1){
							uni.showToast({
								title: "支付成功",
								icon: "none",
								success() {
									setTimeout(function() {
											let pages = getCurrentPages(); // 当前页面
											let beforePage = pages[pages.length - 2]; // 前一个页面
											uni.navigateBack({
												success: function() {
													beforePage.onLoad(); // 执行前一个页面的onLoad方法
												}
											}); 
									}, 1000)								
								}
							})
						}else{
							setTimeout(()=>{
					          this.isPay()
					        },3000)
						}
					
				})

			},
			//检测金额
			checkPrice(){
				if(this.upJson.price>this.total_price){
					uni.showToast({
						title: '收款金额不能大于最大金额,已为你修正为最大金额',
						icon: "none",
					})
					this.upJson.price=this.total_price;
				}
			},
			//打开搜索页面
			openSearch(key) {
				uni.navigateTo({
					url: `/pages/searchList/searchList?searchKey=` + key
				})
			},
			//获取存入账户得方式
			getIntoValue(e) {
				let index = e.detail.value;
				this.upJson.intoType = this.intoTypes[index].title;
				this.intoTypesIndex=index;
			},
			// 收款方式
			getMoneyIndexValue(e) {
				let index = e.detail.value;
				this.upJson.getMoneyType = this.getMoneyTypes[index].title;
				this.getMoneyTypesIndex=index;
				this.createPayQRcode();
			},
			//确认收款
			getMoney(){
				let _this=this;
				uni.showModal({
					title:'提示',
					content:'确认收款?',
					success(res) {
						if(res.cancel) return false;
						_this.collectMoney();
					}
				})
			},
			//收款
			collectMoney(){
				this.$refs.load.initLoading({loadType:-1}).then(res =>{
					this.$api.collectMoney({order_id:this.orderId,price:this.upJson.price}).then(res=>{
						this.$refs.load.getLoadingData({})
						this.$app.globalData.upData.order=true;
						uni.showToast({
							title: res.msg,
							icon: "none",
							success() {
								uni.navigateBack({
									delta:1
								})
							}
						})
					})
				})
				
			}
		}
	}
</script>

<style scoped>
	.collectMoney {
		width: 100%;
		padding-bottom: 50rpx;
		background: #FFFFFF;
	}
	.textArea_item {
		height: auto;
		align-items: flex-start;
		padding: 10rpx 0;
		display: flex;
		justify-content: ;
		justify-content: space-between;
		margin: 0 30rpx;
		border-bottom: 2rpx solid #EEEEEE;
	}
	.textArea_item textarea {
		border: 1rpx solid #ccc;
		border-radius: 6rpx;
		min-height: 150rpx;
		padding: 10rpx 20rpx;
		box-sizing: border-box;
		color: #666;
		font-size: 28rpx;
	}
	.payCodeView {
		margin-top: 30rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.payCode_QRCode {
		width: 300rpx;
		height: 300rpx;
	}
	.payCode_QRCode image{
		width: 100%;
		height: 100%;
	}
</style>
